import React, { useEffect } from 'react'
import avatar from '../assets/back.jpg'
import { useDispatch, useSelector } from 'react-redux'
import { RootState } from '../store'
import { getArticleList } from '../store/actions/newList'

export default function NewsList() {
  const dispatch = useDispatch()
  const activeId = useSelector((state: RootState) => state.channel.activeId)
  const newList = useSelector((state: RootState) => state.newList)
  useEffect(() => {
    dispatch(getArticleList(activeId))
  }, [activeId, dispatch])
  return (
    <div className="list">
      {newList.map((item) => {
        return (
          <div className="article_item" key={item.art_id}>
            <h3 className="van-ellipsis">{item.title}</h3>
            <div className="img_box">
              <img src={avatar} className="w100" alt="" />
            </div>
            <div className="info_box">
              <span>13552285417</span>
              <span>0评论</span>
              <span>2018-11-29T17:02:09</span>
            </div>
          </div>
        )
      })}
    </div>
  )
}